<template>
	<view v-if="theme" class="content" :style="'background: linear-gradient('+theme.ba_color+', #fff 15%);'">
		<view class="hei20"></view>
		<view class="wid90 mar hei80 dis disAl disJuB">
			<picker :value="cityIndex" @change="bindCityChange" :range-key="'title'" :range="addressList">
				<view v-if="city" class="dis disAl">
					<uni-icons type="location-filled" size="30rpx" :color="theme.main_color"></uni-icons>
					<view class="mar-left10 fowe600 foSi25">{{city.title}}</view>
				</view>
			</picker>
			<!-- <view class="dis disAl borRad40 hei60" style="background: #F4FDF6;width: 490rpx;">
				<view class="dis disJuC" style="width: 13%;">
					<uni-icons type="search" size="35rpx" color="#AFB6B1"></uni-icons>
				</view>
				<input class="wid85" v-model="sousuo" @input="sousuoInput" 
					placeholder="输入名字搜索喜欢的技师呦~" placeholder-style="color: #AFB6B1;"/>
			</view> -->
			<view class="dis disAl borRad40 hei60" style="background: #F4FDF6;width: 490rpx;" @click="tiaozhuan1()">
				<view class="dis disJuC" style="width: 13%;">
					<uni-icons type="search" size="30rpx" color="#AFB6B1"></uni-icons>
				</view>
				<view class="wid85 foSi25" style="color: #AFB6B1;">输入名字搜索喜欢的技师呦</view>
			</view>
		</view>
		<index1 :list="bannerList"></index1>
		<index2></index2>
		<index3 v-if="jishiList.length > 0" :list="jishiList"></index3>
		<index4 v-if="fuwuList.length > 0" :list="fuwuList"></index4>
		<view style="height: 100rpx;" :style="{'padding-bottom': paddingBottomHeight + 'rpx'}"></view>
		<!-- <unicloud-city-select ref="citySelect" :hot-city="hotCity" :location="true" @select="select"></unicloud-city-select> -->
		<tablist :back="theme.main_color" :datalist="datalist" :index="0"></tablist>
	</view>
</template>

<script>
	import index1 from '../common/index1.vue'
	import index2 from '../common/index2.vue'
	import index3 from '../common/index3.vue'
	import index4 from '../common/index4.vue'
	import tablist from "../common/tablist/tablist.vue"
	export default {
		components: {
			index1, index2, index3, index4, tablist
		},
		data() {
			return {
				url: this.global.url,
				timer: null,
				sousuo: '',
				bannerList:[],
				jishiList:[],
				fuwuList:[],
				addressList: [],
				cityIndex: 0,
				// 当前选择的城市
				city: null,
				theme: null,
				datalist: [],
				paddingBottomHeight: 0
			}
		},
		created() {
			let that = this;
			uni.hideTabBar()
			uni.getSystemInfo({
				success: function (res) {
					let model = ['X', 'XR', 'XS', '11', '12', '13', '14', '15'];
					model.forEach(item => {
						//适配iphoneX以上的底部，给tabbar一定高度的padding-bottom
						if(res.model.indexOf(item) != -1 && res.model.indexOf('iPhone') != -1) {
							that.paddingBottomHeight = 40;
						}
					})
				}
			});
		},
		async onLoad(option) {
			console.log('看看key');
			console.log(this.global.apiKey);
			uni.setStorageSync('cityName', '长春市');
			// if(!uni.getStorageSync('token')){
			// 	uni.navigateTo({
			// 		url: '/pages/login/login'
			// 	})
			// }
			this.getLocation()
			await this.$style.getIndex(this.url,this.global.site_id)
			this.tdtkey()
			if(!uni.getStorageSync('duan')){
				uni.setStorageSync('duan', 0);
			}
			uni.setStorageSync('distr_id',0)
			uni.setStorageSync('agent_id',0)
			if(option.distr_id){
				uni.setStorageSync('distr_id',option.distr_id)
			}
			if(option.agent_id){
				uni.setStorageSync('agent_id',option.agent_id)
			}
			this.getBanner()
		},
		onShow() {
			this.getAddress()
			if(uni.getStorageSync('city')){
				this.city = uni.getStorageSync('city');
				this.getjishiList()
			}else{
				// this.getLocation()
			}
			this.getfuwuList()
			if(uni.getStorageSync('token')){
				this.getUser()
			}
		},
		methods: {
			tdtkey(lon,lat){
				var that = this;
				uni.request({
					url: that.global.url+'api/qianyu_smfw/common/gzhtdt',
					method: 'POST',
					header:{
						'site-id':that.global.site_id,
						// 'token': uni.getStorageSync('token')
					},
					data: {},
					success(res) {
					    let result = res.data
						console.log(result);
					    if(result.code == 1){
							console.log(result.data.tdtbrowsermap);
							that.global.apiKey=result.data.tdtbrowsermap;
							that.global.apiKeyService=result.data.tdtservicemap;
							that.getAddressName(lon,lat)
						}
					}
				})
			},
			getUser(){
				var that = this
				uni.showLoading({
					title:'加载中...'
				})
				uni.request({
					url: that.global.url+'api/qianyu_smfw/user/userinfo',
					method: 'POST',
					header:{
						'site-id':that.global.site_id,
						'token': uni.getStorageSync('token')
					},
					data: {},
					success(res) {
					    let result = res.data
					    if(result.code != 1){
							// 过期清除用户信息
							uni.removeStorageSync('token')
							uni.removeStorageSync('code')
							console.log(uni.getStorageSync('token'))
							uni.setStorageSync('cdx', 1)
							uni.setStorageSync('duan', 0);
						}
					},
					complete() {
						uni.hideLoading()
					}
				})
			},
			getIndex() {
				var that = this;
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/settings/index',
					method: "POST",
					header: {
						'site-id': that.global.site_id //自定义请求头信息
					},
					data: {},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							uni.setStorageSync('platform', result.data.platform)
							uni.setStorageSync('bom', result.data.bom)
							result.data.theme.ba_color = that.getLightColor(result.data.theme.main_color, 0.7)
							that.theme = result.data.theme
							uni.setStorageSync('theme', result.data.theme)
							console.log('aseada', that.theme.ba_color)
							uni.setNavigationBarColor({
								frontColor: '#000000',
								backgroundColor: that.theme.ba_color, //底部背景色
							})
							that.datalist = result.data.bom
						} else {
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							})
						}
					}
				})
			},
			getfuwuList(){
				var that = this;
				console.log(that.lists);
				uni.request({
					url: that.global.url + '/api/qianyu_smfw/service/lists',
					method: "POST",
					header: {
						'site-id': that.global.site_id, //自定义请求头信息
						'token': uni.getStorageSync('token')
					},
					data: {
						sort: 0,
						page: 1,
					},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							that.fuwuList = result.data.data
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
			},
			getjishiList(){
				var that = this
				uni.request({
					url: that.global.url + '/api/qianyu_smfw/technician/index_technician',
					method: "POST",
					header: {
						'site-id': that.global.site_id//自定义请求头信息
					},
					data: {
						city:uni.getStorageSync('city').id
					},
					success(res) {
						let result = res.data
						console.log(result);
						if (result.code == 1) {
							that.jishiList = result.data
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
			},
			// 获取定位所在城市
			getLocation() {
				var that = this
				
				// #ifdef APP
				const access_fine_location = 'android.permission.ACCESS_FINE_LOCATION'; // 要检查的权限
				plus.android.checkPermission(
				  access_fine_location,
				  granted => {
					  console.log(granted);
					if (granted.checkResult == '-1') {
					  console.log('位置未授权');
					  uni.showModal({
					  	title: '提示',
					  	content: '为了推荐距离您更近以及您所在地区的用户。我们需要获得您设备所在的位置信息（仅获取您所在市区及以上的地区信息）。',
					  	success: function (res) {
							uni.getLocation({
								type: 'gcj02',
								geocode:true,//设置该参数为true可直接获取经纬度及城市信息
								success: async (res) => {
									console.log('获取地址结果',res)
									uni.setStorageSync('lat', res.latitude);
									uni.setStorageSync('lon', res.longitude);
									that.getCity(res.address.city)
									that.tdtkey(res.longitude,res.latitude);
								},
								fail: async (res) => {
									that.getCity('长春市')
								}
							});
					  	}
					  });
					}
				  },
				  error => {
					console.error('Error checking permission:', error.message);
				  }
				);
				// #endif
				
				// #ifdef H5
				uni.getLocation({
					type: 'wgs84',
					success: async (res) => {
						console.log('获取地址结果',res)
						uni.setStorageSync('lat', res.latitude);
						uni.setStorageSync('lon', res.longitude);
						that.tdtkey(res.longitude,res.latitude);
					},
					fail: async (res) => {
						that.getCity('长春市')
					}
				});
				// #endif
			},
			getAddressName(longitude,latitude){
				var that = this
				uni.request({
					url: 'https://api.tianditu.gov.cn/geocoder',
					method: "GET",
					data: {
						type: 'geocode',
						tk: that.global.apiKey,
						postStr: {'lon':longitude,'lat':latitude,'ver':1}
					},
					success(res) {
						console.log('解析的地址',res)
						if(!uni.getStorageSync('city')){
							console.log(res.data.result.addressComponent.city)
							uni.setStorageSync('cityName', res.data.result.addressComponent.city);
							that.getCity(res.data.result.addressComponent.city)
						}
					}
				})
			},
			bindCityChange: function(e) {
				this.cityIndex = e.detail.value
				this.city = this.addressList[this.cityIndex]
				uni.setStorageSync('city', this.addressList[this.cityIndex])
				this.getjishiList()
				this.getfuwuList()
			},
			getAddress(){
				var that = this;
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/common/citylist',
					method: "POST",
					header: {
						'site-id': that.global.site_id //自定义请求头信息
					},
					data: {},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							that.addressList = result.data
							uni.setStorageSync('address', result.data)
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
			},
			getCity(name){
				var that = this;
				console.log('lon：'+uni.getStorageSync('lon'));
				console.log('lat：'+uni.getStorageSync('lat'));
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/common/nearest_city',
					method: "POST",
					header: {
						'site-id': that.global.site_id //自定义请求头信息
					},
					data: {
						lng: uni.getStorageSync('lon')?uni.getStorageSync('lon'):125.35043,
						lat: uni.getStorageSync('lat')?uni.getStorageSync('lat'):43.86414,
						city_name: name
					},
					success(res) {
						let result = res.data
						
						if (result.code == 1) {
							if(result.data.code != 1){
								uni.showToast({
									title: '当前所在城市未开通！',
									//将值设置为 success 或者直接不用写icon这个参数
									icon: 'error',
									//显示持续时间为 2秒
									duration: 2000
								}) 
							}
							that.city = result.data.city
							uni.setStorageSync('city', result.data.city)
							that.getjishiList()
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
			},
			getBanner(){
				var that = this;
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/common/banner',
					method: "POST",
					header: {
						'site-id': that.global.site_id, //自定义请求头信息
						'token': uni.getStorageSync('token')
					},
					data: {
						store_id: that.id
					},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							that.bannerList = result.data
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
				
			},
			sousuoInput: function(event) {
				var that = this
				if (that.timer !== null) clearTimeout(that.timer)
				that.timer = setTimeout(() => {
					that.sousuo = event.target.value
					console.log(that.sousuo)
				}, 1000)
			},
			tiaozhuan1(){
				uni.switchTab({
					url: '/pages/technician/technician?focus=true'
				})
			}
		}
	}
</script>

<style>
	.content {}
	
</style>
